@mieweb/ui 0.7.3-dev.9 → 0.8.0-dev.0

package/dist/brands/index.cjs

@@ -1,21 +1,25 @@
 'use strict';
 
-var chunkJDHIBJ5K_cjs = require('../chunk-JDHIBJ5K.cjs');
+var chunkJWTCEWQ4_cjs = require('../chunk-JWTCEWQ4.cjs');
+var chunkX7S76WB7_cjs = require('../chunk-X7S76WB7.cjs');
 var chunkP52GA3GJ_cjs = require('../chunk-P52GA3GJ.cjs');
 var chunkLCQGAOAZ_cjs = require('../chunk-LCQGAOAZ.cjs');
 var chunkZ5J4NTPL_cjs = require('../chunk-Z5J4NTPL.cjs');
 var chunkU7VQUOLS_cjs = require('../chunk-U7VQUOLS.cjs');
-var chunkRR2MJBGV_cjs = require('../chunk-RR2MJBGV.cjs');
-var chunkX7S76WB7_cjs = require('../chunk-X7S76WB7.cjs');
 var chunkJ644FU54_cjs = require('../chunk-J644FU54.cjs');
 var chunkWNJRS7Y7_cjs = require('../chunk-WNJRS7Y7.cjs');
 var chunkUCGUA3QV_cjs = require('../chunk-UCGUA3QV.cjs');
+var chunkRR2MJBGV_cjs = require('../chunk-RR2MJBGV.cjs');
 
 
 
 Object.defineProperty(exports, "brands", {
   enumerable: true,
-  get: function () { return chunkJDHIBJ5K_cjs.brands; }
+  get: function () { return chunkJWTCEWQ4_cjs.brands; }
+});
+Object.defineProperty(exports, "defaultBrand", {
+  enumerable: true,
+  get: function () { return chunkX7S76WB7_cjs.defaultBrand; }
 });
 Object.defineProperty(exports, "enterpriseHealthBrand", {
   enumerable: true,
@@ -33,14 +37,6 @@ Object.defineProperty(exports, "webchartBrand", {
   enumerable: true,
   get: function () { return chunkU7VQUOLS_cjs.webchartBrand; }
 });
-Object.defineProperty(exports, "ozwellBrand", {
-  enumerable: true,
-  get: function () { return chunkRR2MJBGV_cjs.ozwellBrand; }
-});
-Object.defineProperty(exports, "defaultBrand", {
-  enumerable: true,
-  get: function () { return chunkX7S76WB7_cjs.defaultBrand; }
-});
 Object.defineProperty(exports, "createBrandPreset", {
   enumerable: true,
   get: function () { return chunkJ644FU54_cjs.createBrandPreset; }
@@ -61,5 +57,9 @@ Object.defineProperty(exports, "ccmeBrand", {
   enumerable: true,
   get: function () { return chunkUCGUA3QV_cjs.ccmeBrand; }
 });
+Object.defineProperty(exports, "ozwellBrand", {
+  enumerable: true,
+  get: function () { return chunkRR2MJBGV_cjs.ozwellBrand; }
+});
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map

package/dist/brands/index.js

@@ -1,12 +1,12 @@
-export { brands } from '../chunk-MO65V64I.js';
+export { brands } from '../chunk-TXRQQMG5.js';
+export { defaultBrand } from '../chunk-PSTGFXQG.js';
 export { enterpriseHealthBrand } from '../chunk-MTZPVOP6.js';
 export { miewebBrand } from '../chunk-NERS5ZT6.js';
 export { wagglelineBrand } from '../chunk-2NTYAALC.js';
 export { webchartBrand } from '../chunk-CW66SO5O.js';
-export { ozwellBrand } from '../chunk-5YUBQIC7.js';
-export { defaultBrand } from '../chunk-PSTGFXQG.js';
 export { createBrandPreset, generateBrandCSS, generateTailwindTheme } from '../chunk-WOYUQ4AT.js';
 export { bluehiveBrand } from '../chunk-3T7QGLNB.js';
 export { ccmeBrand } from '../chunk-SCQRJPSV.js';
+export { ozwellBrand } from '../chunk-5YUBQIC7.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/chunk-3IMM2PM4.js

@@ -0,0 +1,259 @@
+import { cn } from './chunk-TQONQSJO.js';
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var inputVariants = cva(
+  [
+    "w-full px-3 py-2",
+    "border border-input rounded-lg",
+    "bg-background text-foreground",
+    "placeholder:text-muted-foreground",
+    "transition-colors duration-200",
+    "focus:outline-none focus:ring-2 focus:ring-ring focus:border-transparent",
+    "disabled:cursor-not-allowed disabled:opacity-50"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "h-8 text-sm",
+        md: "h-10 text-base",
+        lg: "h-12 text-lg"
+      },
+      hasError: {
+        true: "border-destructive focus:ring-destructive",
+        false: ""
+      },
+      labelVariant: {
+        stacked: "",
+        floating: "peer placeholder:text-transparent"
+      }
+    },
+    compoundVariants: [
+      // Floating labels need extra height and asymmetric padding so both
+      // the floated label and the entered text fit inside the field.
+      { labelVariant: "floating", size: "sm", className: "h-11 pt-4 pb-1" },
+      { labelVariant: "floating", size: "md", className: "h-14 pt-5 pb-1.5" },
+      { labelVariant: "floating", size: "lg", className: "h-16 pt-6 pb-2" }
+    ],
+    defaultVariants: {
+      size: "md",
+      hasError: false,
+      labelVariant: "stacked"
+    }
+  }
+);
+var floatingGroupVariants = cva(
+  ["relative rounded-lg border border-input bg-background px-3"],
+  {
+    variants: {
+      size: {
+        sm: "min-h-11 pt-4 pb-1",
+        md: "min-h-14 pt-5 pb-1.5",
+        lg: "min-h-16 pt-6 pb-2"
+      },
+      hasError: {
+        true: "border-destructive",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      size: "md",
+      hasError: false
+    }
+  }
+);
+var floatingGroupLabelVariants = cva(
+  ["absolute start-3 pointer-events-none select-none"],
+  {
+    variants: {
+      size: {
+        sm: "top-0.5 text-[0.65rem]",
+        md: "top-1 text-xs",
+        lg: "top-1.5 text-sm"
+      },
+      hasError: {
+        true: "text-destructive",
+        false: "text-muted-foreground"
+      }
+    },
+    defaultVariants: {
+      size: "md",
+      hasError: false
+    }
+  }
+);
+var floatingLabelVariants = cva(
+  [
+    "absolute start-3 pointer-events-none select-none",
+    "transition-all duration-200 ease-out",
+    // Rest state: vertically centered, placeholder-sized (input is empty and unfocused).
+    "top-1/2 -translate-y-1/2",
+    // Floated state: focused, has a value, or was autofilled → shrink and move to the top,
+    // staying inside the field.
+    "peer-focus:translate-y-0 peer-[:not(:placeholder-shown)]:translate-y-0 peer-autofill:translate-y-0"
+  ],
+  {
+    variants: {
+      size: {
+        sm: [
+          "text-sm",
+          "peer-focus:top-0.5 peer-[:not(:placeholder-shown)]:top-0.5 peer-autofill:top-0.5",
+          "peer-focus:text-[0.65rem] peer-[:not(:placeholder-shown)]:text-[0.65rem] peer-autofill:text-[0.65rem]"
+        ],
+        md: [
+          "text-base",
+          "peer-focus:top-1 peer-[:not(:placeholder-shown)]:top-1 peer-autofill:top-1",
+          "peer-focus:text-xs peer-[:not(:placeholder-shown)]:text-xs peer-autofill:text-xs"
+        ],
+        lg: [
+          "text-lg",
+          "peer-focus:top-1.5 peer-[:not(:placeholder-shown)]:top-1.5 peer-autofill:top-1.5",
+          "peer-focus:text-sm peer-[:not(:placeholder-shown)]:text-sm peer-autofill:text-sm"
+        ]
+      },
+      hasError: {
+        true: "text-destructive",
+        false: "text-muted-foreground"
+      }
+    },
+    defaultVariants: {
+      size: "md",
+      hasError: false
+    }
+  }
+);
+function RequiredMark({
+  variant = "default"
+}) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn(
+        "ms-1",
+        variant === "warning" ? "text-warning" : "text-destructive"
+      ),
+      "aria-hidden": "true",
+      children: "*"
+    }
+  );
+}
+var Input = React.forwardRef(
+  ({
+    className,
+    size,
+    hasError,
+    error,
+    helperText,
+    label,
+    labelVariant = "stacked",
+    hideLabel,
+    required,
+    requiredVariant,
+    disabled,
+    id,
+    placeholder,
+    "aria-describedby": ariaDescribedBy,
+    ...props
+  }, ref) => {
+    const generatedId = React.useId();
+    const inputId = id || generatedId;
+    const errorId = `${inputId}-error`;
+    const helperId = `${inputId}-helper`;
+    const describedByIds = [
+      error ? errorId : null,
+      helperText && !error ? helperId : null,
+      ariaDescribedBy
+    ].filter(Boolean).join(" ");
+    const isFloating = labelVariant === "floating" && !!label && !hideLabel;
+    const requiredMark = required && /* @__PURE__ */ jsx(RequiredMark, { variant: requiredVariant });
+    const inputElement = /* @__PURE__ */ jsx(
+      "input",
+      {
+        "data-slot": "input",
+        id: inputId,
+        ref,
+        className: cn(
+          inputVariants({
+            size,
+            hasError: hasError || !!error,
+            labelVariant: isFloating ? "floating" : "stacked"
+          }),
+          className
+        ),
+        "aria-invalid": hasError || !!error,
+        "aria-describedby": describedByIds || void 0,
+        required,
+        disabled,
+        placeholder: isFloating ? " " : placeholder,
+        ...props
+      }
+    );
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "data-slot": "input-wrapper",
+        className: cn("flex flex-col gap-1.5", disabled && "opacity-50"),
+        children: [
+          label && !isFloating && /* @__PURE__ */ jsxs(
+            "label",
+            {
+              "data-slot": "input-label",
+              htmlFor: inputId,
+              className: cn(
+                "text-foreground text-sm font-medium",
+                hideLabel && "sr-only"
+              ),
+              children: [
+                label,
+                requiredMark
+              ]
+            }
+          ),
+          isFloating ? /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+            inputElement,
+            /* @__PURE__ */ jsxs(
+              "label",
+              {
+                "data-slot": "input-label",
+                htmlFor: inputId,
+                className: floatingLabelVariants({
+                  size,
+                  hasError: hasError || !!error
+                }),
+                children: [
+                  label,
+                  requiredMark
+                ]
+              }
+            )
+          ] }) : inputElement,
+          error && /* @__PURE__ */ jsx(
+            "p",
+            {
+              id: errorId,
+              "data-slot": "input-error",
+              className: "text-destructive-700 dark:text-destructive-400 text-sm",
+              role: "alert",
+              children: error
+            }
+          ),
+          helperText && !error && /* @__PURE__ */ jsx(
+            "p",
+            {
+              id: helperId,
+              "data-slot": "input-helper",
+              className: "text-muted-foreground text-sm",
+              children: helperText
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Input.displayName = "Input";
+
+export { Input, RequiredMark, floatingGroupLabelVariants, floatingGroupVariants, floatingLabelVariants, inputVariants };
+//# sourceMappingURL=chunk-3IMM2PM4.js.map
+//# sourceMappingURL=chunk-3IMM2PM4.js.map

package/dist/chunk-3IMM2PM4.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Input/Input.tsx"],"names":[],"mappings":"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","file":"chunk-3IMM2PM4.js","sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\nconst inputVariants = cva(\n  [\n    'w-full px-3 py-2',\n    'border border-input rounded-lg',\n    'bg-background text-foreground',\n    'placeholder:text-muted-foreground',\n    'transition-colors duration-200',\n    'focus:outline-none focus:ring-2 focus:ring-ring focus:border-transparent',\n    'disabled:cursor-not-allowed disabled:opacity-50',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'h-8 text-sm',\n        md: 'h-10 text-base',\n        lg: 'h-12 text-lg',\n      },\n      hasError: {\n        true: 'border-destructive focus:ring-destructive',\n        false: '',\n      },\n      labelVariant: {\n        stacked: '',\n        floating: 'peer placeholder:text-transparent',\n      },\n    },\n    compoundVariants: [\n      // Floating labels need extra height and asymmetric padding so both\n      // the floated label and the entered text fit inside the field.\n      { labelVariant: 'floating', size: 'sm', className: 'h-11 pt-4 pb-1' },\n      { labelVariant: 'floating', size: 'md', className: 'h-14 pt-5 pb-1.5' },\n      { labelVariant: 'floating', size: 'lg', className: 'h-16 pt-6 pb-2' },\n    ],\n    defaultVariants: {\n      size: 'md',\n      hasError: false,\n      labelVariant: 'stacked',\n    },\n  }\n);\n\n// Bordered field box for group controls (RadioGroup / CheckboxGroup) rendered\n// with labelVariant=\"floating\". Mirrors the floating input's box metrics so\n// mixed forms stay vertically aligned.\nconst floatingGroupVariants = cva(\n  ['relative rounded-lg border border-input bg-background px-3'],\n  {\n    variants: {\n      size: {\n        sm: 'min-h-11 pt-4 pb-1',\n        md: 'min-h-14 pt-5 pb-1.5',\n        lg: 'min-h-16 pt-6 pb-2',\n      },\n      hasError: {\n        true: 'border-destructive',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n      hasError: false,\n    },\n  }\n);\n\n// Group label fixed in the floated position (groups have no empty state to\n// float from, so the label never animates). Metrics match the floated state\n// of floatingLabelVariants.\nconst floatingGroupLabelVariants = cva(\n  ['absolute start-3 pointer-events-none select-none'],\n  {\n    variants: {\n      size: {\n        sm: 'top-0.5 text-[0.65rem]',\n        md: 'top-1 text-xs',\n        lg: 'top-1.5 text-sm',\n      },\n      hasError: {\n        true: 'text-destructive',\n        false: 'text-muted-foreground',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n      hasError: false,\n    },\n  }\n);\n\nconst floatingLabelVariants = cva(\n  [\n    'absolute start-3 pointer-events-none select-none',\n    'transition-all duration-200 ease-out',\n    // Rest state: vertically centered, placeholder-sized (input is empty and unfocused).\n    'top-1/2 -translate-y-1/2',\n    // Floated state: focused, has a value, or was autofilled → shrink and move to the top,\n    // staying inside the field.\n    'peer-focus:translate-y-0 peer-[:not(:placeholder-shown)]:translate-y-0 peer-autofill:translate-y-0',\n  ],\n  {\n    variants: {\n      size: {\n        sm: [\n          'text-sm',\n          'peer-focus:top-0.5 peer-[:not(:placeholder-shown)]:top-0.5 peer-autofill:top-0.5',\n          'peer-focus:text-[0.65rem] peer-[:not(:placeholder-shown)]:text-[0.65rem] peer-autofill:text-[0.65rem]',\n        ],\n        md: [\n          'text-base',\n          'peer-focus:top-1 peer-[:not(:placeholder-shown)]:top-1 peer-autofill:top-1',\n          'peer-focus:text-xs peer-[:not(:placeholder-shown)]:text-xs peer-autofill:text-xs',\n        ],\n        lg: [\n          'text-lg',\n          'peer-focus:top-1.5 peer-[:not(:placeholder-shown)]:top-1.5 peer-autofill:top-1.5',\n          'peer-focus:text-sm peer-[:not(:placeholder-shown)]:text-sm peer-autofill:text-sm',\n        ],\n      },\n      hasError: {\n        true: 'text-destructive',\n        false: 'text-muted-foreground',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n      hasError: false,\n    },\n  }\n);\n\nexport interface InputProps\n  extends\n    Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>,\n    Omit<VariantProps<typeof inputVariants>, 'labelVariant'> {\n  /** Error message to display below the input */\n  error?: string;\n  /** Helper text to display below the input */\n  helperText?: string;\n  /** Label for the input */\n  label?: string;\n  /**\n   * How the label is rendered.\n   * - `stacked` (default): label above the input.\n   * - `floating`: label rests inside the input like a placeholder and floats\n   *   to the top of the field (staying inside it) when focused or filled.\n   *   Ignores `placeholder`; when `hideLabel` is set, falls back to a\n   *   visually-hidden stacked label.\n   */\n  labelVariant?: 'stacked' | 'floating';\n  /** Whether the label should be visually hidden (still accessible) */\n  hideLabel?: boolean;\n  /** Whether the input is required */\n  required?: boolean;\n  /**\n   * Color of the required asterisk.\n   * - `default`: destructive (hard requirement).\n   * - `warning`: warning color (soft requirement / recommended).\n   */\n  requiredVariant?: RequiredMarkVariant;\n}\n\ntype RequiredMarkVariant = 'default' | 'warning';\n\n/** Asterisk rendered next to a label when the field is required. */\nfunction RequiredMark({\n  variant = 'default',\n}: {\n  variant?: RequiredMarkVariant;\n}) {\n  return (\n    <span\n      className={cn(\n        'ms-1',\n        variant === 'warning' ? 'text-warning' : 'text-destructive'\n      )}\n      aria-hidden=\"true\"\n    >\n      *\n    </span>\n  );\n}\n\n/**\n * A styled input component with support for labels, errors, and helper text.\n *\n * @example\n * ```tsx\n * <Input label=\"Email\" type=\"email\" placeholder=\"you@example.com\" />\n * <Input label=\"Password\" type=\"password\" error=\"Password is required\" hasError />\n * <Input label=\"Account number\" labelVariant=\"floating\" />\n * ```\n */\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  (\n    {\n      className,\n      size,\n      hasError,\n      error,\n      helperText,\n      label,\n      labelVariant = 'stacked',\n      hideLabel,\n      required,\n      requiredVariant,\n      disabled,\n      id,\n      placeholder,\n      'aria-describedby': ariaDescribedBy,\n      ...props\n    },\n    ref\n  ) => {\n    const generatedId = React.useId();\n    const inputId = id || generatedId;\n    const errorId = `${inputId}-error`;\n    const helperId = `${inputId}-helper`;\n\n    const describedByIds = [\n      error ? errorId : null,\n      helperText && !error ? helperId : null,\n      ariaDescribedBy,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    const isFloating = labelVariant === 'floating' && !!label && !hideLabel;\n\n    const requiredMark = required && <RequiredMark variant={requiredVariant} />;\n\n    const inputElement = (\n      <input\n        data-slot=\"input\"\n        id={inputId}\n        ref={ref}\n        className={cn(\n          inputVariants({\n            size,\n            hasError: hasError || !!error,\n            labelVariant: isFloating ? 'floating' : 'stacked',\n          }),\n          className\n        )}\n        aria-invalid={hasError || !!error}\n        aria-describedby={describedByIds || undefined}\n        required={required}\n        disabled={disabled}\n        // A single-space placeholder keeps :placeholder-shown reliable so the\n        // label can float via CSS alone; a user placeholder would clash with\n        // the resting label.\n        placeholder={isFloating ? ' ' : placeholder}\n        {...props}\n      />\n    );\n\n    return (\n      <div\n        data-slot=\"input-wrapper\"\n        className={cn('flex flex-col gap-1.5', disabled && 'opacity-50')}\n      >\n        {label && !isFloating && (\n          <label\n            data-slot=\"input-label\"\n            htmlFor={inputId}\n            className={cn(\n              'text-foreground text-sm font-medium',\n              hideLabel && 'sr-only'\n            )}\n          >\n            {label}\n            {requiredMark}\n          </label>\n        )}\n        {isFloating ? (\n          <div className=\"relative\">\n            {inputElement}\n            <label\n              data-slot=\"input-label\"\n              htmlFor={inputId}\n              className={floatingLabelVariants({\n                size,\n                hasError: hasError || !!error,\n              })}\n            >\n              {label}\n              {requiredMark}\n            </label>\n          </div>\n        ) : (\n          inputElement\n        )}\n        {error && (\n          <p\n            id={errorId}\n            data-slot=\"input-error\"\n            className=\"text-destructive-700 dark:text-destructive-400 text-sm\"\n            role=\"alert\"\n          >\n            {error}\n          </p>\n        )}\n        {helperText && !error && (\n          <p\n            id={helperId}\n            data-slot=\"input-helper\"\n            className=\"text-muted-foreground text-sm\"\n          >\n            {helperText}\n          </p>\n        )}\n      </div>\n    );\n  }\n);\n\nInput.displayName = 'Input';\n\nexport {\n  Input,\n  RequiredMark,\n  inputVariants,\n  floatingLabelVariants,\n  floatingGroupVariants,\n  floatingGroupLabelVariants,\n};\nexport type { RequiredMarkVariant };\n"]}

package/dist/chunk-3SHLOF4V.cjs

@@ -0,0 +1,128 @@
+'use strict';
+
+var chunkP2VTQ5AR_cjs = require('./chunk-P2VTQ5AR.cjs');
+var chunkS5RVSXDV_cjs = require('./chunk-S5RVSXDV.cjs');
+var React = require('react');
+var lucideReact = require('lucide-react');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var Kbd = React__namespace.forwardRef(function Kbd2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "kbd",
+    {
+      ref,
+      className: chunkS5RVSXDV_cjs.cn(
+        "border-border bg-muted text-foreground rounded border px-1.5 py-0.5 font-mono text-[11px]",
+        className
+      ),
+      ...props
+    }
+  );
+});
+function Keys({
+  keys,
+  alternativesLabel
+}) {
+  const list = Array.isArray(keys) ? keys : keys.split(" / ");
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex shrink-0 items-center gap-1", children: list.map((k, i) => /* @__PURE__ */ jsxRuntime.jsxs(React__namespace.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Kbd, { children: k }),
+    i < list.length - 1 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground mx-0.5 text-xs", children: alternativesLabel })
+  ] }, `${k}-${i}`)) });
+}
+function ShortcutList({
+  shortcuts,
+  alternativesLabel
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex list-none flex-col gap-2 p-0", children: shortcuts.map((s) => /* @__PURE__ */ jsxRuntime.jsxs(
+    "li",
+    {
+      className: "text-foreground flex items-center justify-between gap-4 text-sm",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0", children: s.description }),
+        /* @__PURE__ */ jsxRuntime.jsx(Keys, { keys: s.keys, alternativesLabel })
+      ]
+    },
+    `${s.description}-${String(s.keys)}`
+  )) });
+}
+function KeyboardShortcutsOverlay({
+  open,
+  onClose,
+  shortcuts,
+  groups,
+  title = "Keyboard shortcuts",
+  hint,
+  alternativesLabel = "or"
+}) {
+  const defaultHint = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    "Press ",
+    /* @__PURE__ */ jsxRuntime.jsx(Kbd, { children: "?" }),
+    " anytime to toggle this help"
+  ] });
+  const footer = hint === null ? null : hint ?? defaultHint;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    chunkP2VTQ5AR_cjs.Modal,
+    {
+      open,
+      onOpenChange: (o) => {
+        if (!o) onClose();
+      },
+      size: "sm",
+      "aria-label": title,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(chunkP2VTQ5AR_cjs.ModalHeader, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(chunkP2VTQ5AR_cjs.ModalTitle, { className: "flex items-center gap-2 text-sm", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Keyboard, { "aria-hidden": "true", className: "text-primary-500 h-4 w-4" }),
+            title
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(chunkP2VTQ5AR_cjs.ModalClose, {})
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs(chunkP2VTQ5AR_cjs.ModalBody, { className: "flex flex-col gap-4", children: [
+          shortcuts && /* @__PURE__ */ jsxRuntime.jsx(
+            ShortcutList,
+            {
+              shortcuts,
+              alternativesLabel
+            }
+          ),
+          groups?.map((group) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-muted-foreground text-xs font-semibold tracking-wide uppercase", children: group.title }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ShortcutList,
+              {
+                shortcuts: group.shortcuts,
+                alternativesLabel
+              }
+            )
+          ] }, group.title))
+        ] }),
+        footer && /* @__PURE__ */ jsxRuntime.jsx(chunkP2VTQ5AR_cjs.ModalFooter, { className: "text-muted-foreground justify-center text-[11px]", children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: footer }) })
+      ]
+    }
+  );
+}
+
+exports.Kbd = Kbd;
+exports.KeyboardShortcutsOverlay = KeyboardShortcutsOverlay;
+//# sourceMappingURL=chunk-3SHLOF4V.cjs.map
+//# sourceMappingURL=chunk-3SHLOF4V.cjs.map

package/dist/chunk-3SHLOF4V.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/KeyboardShortcutsOverlay/KeyboardShortcutsOverlay.tsx"],"names":["React","Kbd","jsx","cn","jsxs","Fragment","Modal","ModalHeader","ModalTitle","Keyboard","ModalClose","ModalBody","ModalFooter"],"mappings":"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","file":"chunk-3SHLOF4V.cjs","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Keyboard } from 'lucide-react';\nimport { cn } from '../../utils/cn';\nimport {\n  Modal,\n  ModalHeader,\n  ModalTitle,\n  ModalClose,\n  ModalBody,\n  ModalFooter,\n} from '../Modal';\n\n// =============================================================================\n// Kbd\n// =============================================================================\n\nexport type KbdProps = React.HTMLAttributes<HTMLElement>;\n\n/** A keyboard-key chip: `<Kbd>⌘K</Kbd>`. */\nexport const Kbd = React.forwardRef<HTMLElement, KbdProps>(function Kbd(\n  { className, ...props },\n  ref\n) {\n  return (\n    <kbd\n      ref={ref}\n      className={cn(\n        'border-border bg-muted text-foreground rounded border px-1.5 py-0.5 font-mono text-[11px]',\n        className\n      )}\n      {...props}\n    />\n  );\n});\n\n// =============================================================================\n// KeyboardShortcutsOverlay\n// =============================================================================\n\nexport interface ShortcutDef {\n  /** Key or alternatives — `\"j\"`, `[\"j\", \"↓\"]`, `\"⌘K\"`. */\n  keys: string | string[];\n  description: string;\n}\n\nexport interface ShortcutGroup {\n  title: string;\n  shortcuts: ShortcutDef[];\n}\n\nexport interface KeyboardShortcutsOverlayProps {\n  open: boolean;\n  onClose: () => void;\n  /** Flat list of shortcuts, or use `groups` for sectioned help. */\n  shortcuts?: ShortcutDef[];\n  /** Sectioned shortcuts with group headings. */\n  groups?: ShortcutGroup[];\n  title?: string;\n  /** Footer hint. Pass `null` to hide it. */\n  hint?: React.ReactNode | null;\n  /** Joins key alternatives (default \"or\"), overridable for i18n. */\n  alternativesLabel?: string;\n}\n\nfunction Keys({\n  keys,\n  alternativesLabel,\n}: {\n  keys: string | string[];\n  alternativesLabel: string;\n}) {\n  const list = Array.isArray(keys) ? keys : keys.split(' / ');\n  return (\n    <span className=\"flex shrink-0 items-center gap-1\">\n      {list.map((k, i) => (\n        <React.Fragment key={`${k}-${i}`}>\n          <Kbd>{k}</Kbd>\n          {i < list.length - 1 && (\n            <span className=\"text-muted-foreground mx-0.5 text-xs\">\n              {alternativesLabel}\n            </span>\n          )}\n        </React.Fragment>\n      ))}\n    </span>\n  );\n}\n\nfunction ShortcutList({\n  shortcuts,\n  alternativesLabel,\n}: {\n  shortcuts: ShortcutDef[];\n  alternativesLabel: string;\n}) {\n  return (\n    <ul className=\"flex list-none flex-col gap-2 p-0\">\n      {shortcuts.map((s) => (\n        <li\n          key={`${s.description}-${String(s.keys)}`}\n          className=\"text-foreground flex items-center justify-between gap-4 text-sm\"\n        >\n          <span className=\"min-w-0\">{s.description}</span>\n          <Keys keys={s.keys} alternativesLabel={alternativesLabel} />\n        </li>\n      ))}\n    </ul>\n  );\n}\n\n/**\n * The `?` keyboard-shortcuts help dialog: a list of shortcut rows\n * (optionally grouped) with `Kbd` chips for each key. Pairs with the\n * `useKeyboardShortcut` hook, which handles the binding — this component\n * only renders the help.\n *\n * @example\n * ```tsx\n * const [open, setOpen] = useState(false);\n * useKeyboardShortcut('?', () => setOpen((v) => !v), {\n *   modifiers: { shift: true },\n * });\n *\n * <KeyboardShortcutsOverlay\n *   open={open}\n *   onClose={() => setOpen(false)}\n *   shortcuts={[\n *     { keys: ['j', '↓'], description: 'Next record' },\n *     { keys: '⌘K', description: 'Command palette' },\n *   ]}\n * />\n * ```\n */\nexport function KeyboardShortcutsOverlay({\n  open,\n  onClose,\n  shortcuts,\n  groups,\n  title = 'Keyboard shortcuts',\n  hint,\n  alternativesLabel = 'or',\n}: KeyboardShortcutsOverlayProps) {\n  const defaultHint = (\n    <>\n      Press <Kbd>?</Kbd> anytime to toggle this help\n    </>\n  );\n  const footer = hint === null ? null : (hint ?? defaultHint);\n\n  return (\n    <Modal\n      open={open}\n      onOpenChange={(o) => {\n        if (!o) onClose();\n      }}\n      size=\"sm\"\n      aria-label={title}\n    >\n      <ModalHeader>\n        <ModalTitle className=\"flex items-center gap-2 text-sm\">\n          <Keyboard aria-hidden=\"true\" className=\"text-primary-500 h-4 w-4\" />\n          {title}\n        </ModalTitle>\n        <ModalClose />\n      </ModalHeader>\n      <ModalBody className=\"flex flex-col gap-4\">\n        {shortcuts && (\n          <ShortcutList\n            shortcuts={shortcuts}\n            alternativesLabel={alternativesLabel}\n          />\n        )}\n        {groups?.map((group) => (\n          <div key={group.title} className=\"flex flex-col gap-2\">\n            <h3 className=\"text-muted-foreground text-xs font-semibold tracking-wide uppercase\">\n              {group.title}\n            </h3>\n            <ShortcutList\n              shortcuts={group.shortcuts}\n              alternativesLabel={alternativesLabel}\n            />\n          </div>\n        ))}\n      </ModalBody>\n      {footer && (\n        <ModalFooter className=\"text-muted-foreground justify-center text-[11px]\">\n          <span>{footer}</span>\n        </ModalFooter>\n      )}\n    </Modal>\n  );\n}\n"]}

package/dist/chunk-3TXOFAXP.cjs

@@ -0,0 +1,139 @@
+'use strict';
+
+var chunkS5RVSXDV_cjs = require('./chunk-S5RVSXDV.cjs');
+var React = require('react');
+var luxon = require('luxon');
+var lucideReact = require('lucide-react');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var DEFAULT_THRESHOLDS = { fresh: 90, aging: 180 };
+function toDateTime(date) {
+  return typeof date === "string" ? luxon.DateTime.fromISO(date) : luxon.DateTime.fromJSDate(date);
+}
+function daysSince(date) {
+  const dt = toDateTime(date);
+  if (!dt.isValid) return null;
+  const days = Math.floor(luxon.DateTime.now().diff(dt, "days").days);
+  return Math.max(0, days);
+}
+function levelForDays(days, thresholds) {
+  if (days === null) return "unknown";
+  if (days < thresholds.fresh) return "fresh";
+  if (days < thresholds.aging) return "aging";
+  return "stale";
+}
+function freshnessLevel(date, thresholds = DEFAULT_THRESHOLDS) {
+  return levelForDays(daysSince(date), thresholds);
+}
+function ageText(days) {
+  if (days === null) return "date unknown";
+  return days === 0 ? "today" : days === 1 ? "yesterday" : `${days}d ago`;
+}
+var META = {
+  fresh: {
+    Icon: lucideReact.CircleCheck,
+    chip: "bg-success/10 text-success-800 dark:bg-success/20 dark:text-success",
+    dot: "bg-success",
+    label: "Fresh"
+  },
+  aging: {
+    Icon: lucideReact.CircleMinus,
+    chip: "bg-warning/15 text-warning-800 dark:bg-warning/20 dark:text-warning",
+    dot: "bg-warning",
+    label: "Aging"
+  },
+  stale: {
+    Icon: lucideReact.CircleAlert,
+    chip: "bg-destructive/10 text-destructive-700 dark:bg-destructive/20 dark:text-destructive",
+    dot: "bg-destructive",
+    label: "Stale"
+  },
+  unknown: {
+    Icon: lucideReact.CircleHelp,
+    chip: "bg-muted text-muted-foreground",
+    dot: "bg-muted-foreground/50",
+    label: "Unknown"
+  }
+};
+var FreshnessBadge = React__namespace.forwardRef(function FreshnessBadge2({
+  date,
+  thresholds = DEFAULT_THRESHOLDS,
+  label = "Reviewed",
+  className,
+  ...props
+}, ref) {
+  const days = daysSince(date);
+  const level = levelForDays(days, thresholds);
+  const { Icon, chip } = META[level];
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "span",
+    {
+      ref,
+      className: chunkS5RVSXDV_cjs.cn(
+        "inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-[11px] font-semibold",
+        chip,
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Icon, { "aria-hidden": "true", className: "h-3 w-3 shrink-0" }),
+        label,
+        " ",
+        ageText(days)
+      ]
+    }
+  );
+});
+var FreshnessDot = React__namespace.forwardRef(function FreshnessDot2({
+  date,
+  thresholds = DEFAULT_THRESHOLDS,
+  label = "Reviewed",
+  className,
+  ...props
+}, ref) {
+  const days = daysSince(date);
+  const level = levelForDays(days, thresholds);
+  const description = `${META[level].label} \u2014 ${label} ${ageText(days)}`;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      ref,
+      role: "img",
+      "aria-label": description,
+      title: description,
+      className: chunkS5RVSXDV_cjs.cn(
+        "inline-block h-2 w-2 shrink-0 rounded-full",
+        META[level].dot,
+        className
+      ),
+      ...props
+    }
+  );
+});
+
+exports.FreshnessBadge = FreshnessBadge;
+exports.FreshnessDot = FreshnessDot;
+exports.daysSince = daysSince;
+exports.freshnessLevel = freshnessLevel;
+//# sourceMappingURL=chunk-3TXOFAXP.cjs.map
+//# sourceMappingURL=chunk-3TXOFAXP.cjs.map

package/dist/chunk-3TXOFAXP.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/FreshnessBadge/FreshnessBadge.tsx"],"names":["DateTime","CircleCheck","CircleMinus","CircleAlert","CircleHelp","React","FreshnessBadge","jsxs","cn","jsx","FreshnessDot"],"mappings":"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","file":"chunk-3TXOFAXP.cjs","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { DateTime } from 'luxon';\nimport {\n  CircleAlert,\n  CircleCheck,\n  CircleHelp,\n  CircleMinus,\n} from 'lucide-react';\nimport { cn } from '../../utils/cn';\n\n// =============================================================================\n// Types & helpers\n// =============================================================================\n\nexport type FreshnessLevel = 'fresh' | 'aging' | 'stale' | 'unknown';\n\nexport interface FreshnessThresholds {\n  /** Days within which a date counts as fresh (default 90). */\n  fresh: number;\n  /** Days within which a date counts as aging; beyond is stale (default 180). */\n  aging: number;\n}\n\nconst DEFAULT_THRESHOLDS: FreshnessThresholds = { fresh: 90, aging: 180 };\n\nfunction toDateTime(date: string | Date): DateTime {\n  return typeof date === 'string'\n    ? DateTime.fromISO(date)\n    : DateTime.fromJSDate(date);\n}\n\n/**\n * Whole days elapsed since the given date (0 for today/future), or `null`\n * when the date cannot be parsed.\n */\nexport function daysSince(date: string | Date): number | null {\n  const dt = toDateTime(date);\n  if (!dt.isValid) return null;\n  const days = Math.floor(DateTime.now().diff(dt, 'days').days);\n  return Math.max(0, days);\n}\n\nfunction levelForDays(\n  days: number | null,\n  thresholds: FreshnessThresholds\n): FreshnessLevel {\n  if (days === null) return 'unknown';\n  if (days < thresholds.fresh) return 'fresh';\n  if (days < thresholds.aging) return 'aging';\n  return 'stale';\n}\n\n/**\n * Bucket a date into fresh / aging / stale by day thresholds. Unparseable\n * dates return `unknown` rather than masquerading as fresh or stale.\n */\nexport function freshnessLevel(\n  date: string | Date,\n  thresholds: FreshnessThresholds = DEFAULT_THRESHOLDS\n): FreshnessLevel {\n  return levelForDays(daysSince(date), thresholds);\n}\n\nfunction ageText(days: number | null): string {\n  if (days === null) return 'date unknown';\n  return days === 0 ? 'today' : days === 1 ? 'yesterday' : `${days}d ago`;\n}\n\nconst META: Record<\n  FreshnessLevel,\n  { Icon: typeof CircleCheck; chip: string; dot: string; label: string }\n> = {\n  fresh: {\n    Icon: CircleCheck,\n    chip: 'bg-success/10 text-success-800 dark:bg-success/20 dark:text-success',\n    dot: 'bg-success',\n    label: 'Fresh',\n  },\n  aging: {\n    Icon: CircleMinus,\n    chip: 'bg-warning/15 text-warning-800 dark:bg-warning/20 dark:text-warning',\n    dot: 'bg-warning',\n    label: 'Aging',\n  },\n  stale: {\n    Icon: CircleAlert,\n    chip: 'bg-destructive/10 text-destructive-700 dark:bg-destructive/20 dark:text-destructive',\n    dot: 'bg-destructive',\n    label: 'Stale',\n  },\n  unknown: {\n    Icon: CircleHelp,\n    chip: 'bg-muted text-muted-foreground',\n    dot: 'bg-muted-foreground/50',\n    label: 'Unknown',\n  },\n};\n\n// =============================================================================\n// Components\n// =============================================================================\n\nexport interface FreshnessBadgeProps extends React.HTMLAttributes<HTMLSpanElement> {\n  /** The date being aged — last review, last sync, last update. */\n  date: string | Date;\n  /** Day cutoffs for fresh/aging (default 90/180). */\n  thresholds?: FreshnessThresholds;\n  /** Verb before the age (default \"Reviewed\"). */\n  label?: string;\n}\n\n/**\n * A recency chip that ages from success through warning to destructive:\n * \"Reviewed 12d ago\". Suits source registries, sync statuses, data-quality\n * dashboards — anywhere staleness is a signal.\n *\n * @example\n * ```tsx\n * <FreshnessBadge date=\"2026-07-01\" />\n * <FreshnessBadge date={lastSync} label=\"Synced\" thresholds={{ fresh: 1, aging: 7 }} />\n * ```\n */\nexport const FreshnessBadge = React.forwardRef<\n  HTMLSpanElement,\n  FreshnessBadgeProps\n>(function FreshnessBadge(\n  {\n    date,\n    thresholds = DEFAULT_THRESHOLDS,\n    label = 'Reviewed',\n    className,\n    ...props\n  },\n  ref\n) {\n  const days = daysSince(date);\n  const level = levelForDays(days, thresholds);\n  const { Icon, chip } = META[level];\n  return (\n    <span\n      ref={ref}\n      className={cn(\n        'inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-[11px] font-semibold',\n        chip,\n        className\n      )}\n      {...props}\n    >\n      <Icon aria-hidden=\"true\" className=\"h-3 w-3 shrink-0\" />\n      {label} {ageText(days)}\n    </span>\n  );\n});\n\nexport interface FreshnessDotProps extends React.HTMLAttributes<HTMLSpanElement> {\n  date: string | Date;\n  thresholds?: FreshnessThresholds;\n  /** Verb used in the accessible label and tooltip (default \"Reviewed\"). */\n  label?: string;\n}\n\n/** Colored dot for tight spots — table cells, tooltip source rows. */\nexport const FreshnessDot = React.forwardRef<\n  HTMLSpanElement,\n  FreshnessDotProps\n>(function FreshnessDot(\n  {\n    date,\n    thresholds = DEFAULT_THRESHOLDS,\n    label = 'Reviewed',\n    className,\n    ...props\n  },\n  ref\n) {\n  const days = daysSince(date);\n  const level = levelForDays(days, thresholds);\n  const description = `${META[level].label} — ${label} ${ageText(days)}`;\n  return (\n    <span\n      ref={ref}\n      role=\"img\"\n      aria-label={description}\n      title={description}\n      className={cn(\n        'inline-block h-2 w-2 shrink-0 rounded-full',\n        META[level].dot,\n        className\n      )}\n      {...props}\n    />\n  );\n});\n"]}